<template>
  <div class="consensus-activity-withdraw">
    <c-title :text="text"></c-title>
    <div class="head" @click="showPopup">
      <template v-if="name == 'asset'">
          <span>{{ default_name }}：{{default_amount }}</span>
          <i class="iconfont icon-member_right"></i>
      </template>
      <template v-else>
        <span>当前{{ custom_name.reopen_name }}：{{ reopen }}</span>
      </template>
    </div>
    <div class="main">
      <div class="member" v-if="type == 5">
        <span style="flex-shrink: 0;">受让人ID</span>
        <input type="text" v-model="member_id" placeholder="请输入" />
      </div>
      <p class="left fz26">转让数量</p>

      <div class="content">
        <input type="text" v-model="count"  @focus="onFocus"/>
        <span class="all" @click="all_handle">全部</span>
      </div>
      <p class="tips" v-if=" name == 'reopen' ">
        <template v-if="name == 'reopen' && type == 1">最低兑换{{ dividend_min }},兑换比例1:{{ reopen_to_add_weight_dividend_rate
        }}</template>
        <template v-if="(type == 3 || type==4) && name == 'reopen'">手续费{{ type==3? reopen_to_consume_fee_rate:reopen_to_yuan_withdraw_fee_rate }}%</template>
      </p>
      <p  class="tips" v-if="(name=='asset'&&type == 3) || (name=='asset'&&type == 4) ">
        <template>手续费{{ type==3? origin_to_consume_fee_rate:origin_to_yuan_withdraw_fee_rate }}%</template>
      </p>
      <div class="h50" v-if="(type == 1 && name !== 'reopen') || type == 2 || type == 5 || type == 6"></div>
      <van-button block color="#F15353" round @click="submit">确定</van-button>
    </div>


    <van-popup v-model="CategoryShow" round position="bottom">
      <div class="flex between align-center popup-top">
        <span @click="CategoryShow = false" class='pointer'>取消</span>
        <span>{{origin_asset_name}}</span>
        <span class="c-FF2F2F pointer" @click="confirmCategory">确认</span>
      </div>
      <van-radio-group v-model="radio" checked-color="#F43629">
        <van-cell-group>
          <van-cell v-for="item in category_list" :key="item.asset_id"  clickable>
            {{ item.origin_asset.name }}:{{ item.amount }}
            <template #right-icon>
              <van-radio :name="item.asset_id" />
            </template>
          </van-cell>
        </van-cell-group>
      </van-radio-group>
    </van-popup>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dividend_min: 0,
      text: "转入加权分红额度",//1-转入加权分红额度、2-转入质积分、3-转入消费积分、4-转入元积分提现配额、5-会员转让、6-积分
      count: 0,
      CategoryShow: false,
      type: null,
      radio: "",
      category_list: [],
      name: "",
      custom_name: {},
      reopen: 0,
      reopen_to_add_weight_dividend_rate: 0,
      reopen_to_consume_fee_rate:0,
      reopen_to_yuan_withdraw_fee_rate:0,

      origin_to_consume_fee_rate:"",
      origin_to_yuan_withdraw_fee_rate:"",
      default_name:"",
      default_amount:"",
      origin_asset_name:"",
      member_id:"",
    };
  },
  activated() {
    this.name = this.$route.params.name;
    this.type = Number(this.$route.params.num);
    this.radio = "";
    this.count = 0;
    this.getData();
  },
  methods: {
    showPopup(){
      if(this.name == 'asset'){
        this.CategoryShow = true;
      }
    },
    onFocus(){
      if(Number(this.count)==0){
        this.count = '';
      }
    },
    focus(){
      this.count = "";
    },
    submit() {
      let url = "";
      if (this.name == 'reopen') {
        if (this.type == 1) {
          url = 'plugin.wise-yuan-trade.frontend.reopen-value.to-add-weight';
        } else if (this.type == 2) {
          url = `plugin.wise-yuan-trade.frontend.reopen-value.to-quality`;
        } else if (this.type == 3) {
          url = 'plugin.wise-yuan-trade.frontend.reopen-value.to-integral-point';
        } else if (this.type == 4) {
          url = 'plugin.wise-yuan-trade.frontend.reopen-value.to-yuan-quota';
        } else if (this.type == 6) {
          url = 'plugin.wise-yuan-trade.frontend.reopen-value.to-point';
        }
      } else {
        if (this.type == 1) {
          url = 'plugin.wise-yuan-trade.frontend.origin-asset.to-add-weight';
        } else if (this.type == 2) {
          url = `plugin.wise-yuan-trade.frontend.origin-asset.to-quality`;
        } else if (this.type == 3) {
          url = 'plugin.wise-yuan-trade.frontend.origin-asset.to-integral-point';
        } else if (this.type == 4) {
          url = 'plugin.wise-yuan-trade.frontend.origin-asset.to-yuan-quota';
        } else {
          url = 'plugin.wise-yuan-trade.frontend.origin-asset.transfer';
        }
      }
      let json = {amount:Number(this.count)};
      if(this.name == 'asset'){
        json.asset_id = this.radio;
        if(this.type == 5){
          json.uid = this.member_id;
        }
      }

      $http.post(url,json,'').then(res=>{
        this.$toast(res.msg);
        if(res.result){
          this.count = 0;
            this.getData();
        }
      })
    },
    getData() {
      let url = "plugin.wise-yuan-trade.frontend.origin-asset.index";
      if (this.name == 'reopen') {
        url = "plugin.wise-yuan-trade.frontend.reopen-value.index"
      }
      $http.get(url, "", "").then(res => {
        if (res.result) {
          let data = res.data;
          this.custom_name = data.custom_name;
          let text = '';
          if (this.type == 1) {
            text = '转入加权分红额度';
          } else if (this.type == 2) {
            text = `转入${data.custom_name.quality_name}`;
          } else if (this.type == 3) {
            text = `转入${data.integral_name || data.custom_name.integral_name}`;
          } else if (this.type == 4) {
            text = `转入${data.custom_name.yuan_withdraw_limit_name}`;
          } else if (this.type == 6) {
            text = `转入${data.point_name}`;
          } else {
            text = '会员转让';
          }
          if(this.name == 'asset'){
            if(!this.radio){
              this.radio = data.origin_asset_list[0].asset_id;
              this.default_name = data.origin_asset_list[0].origin_asset.name;
              this.default_amount = data.origin_asset_list[0].amount;
            }else{
              let index =data.origin_asset_list.findIndex(item=>item.asset_id == this.radio);
              this.default_name = data.origin_asset_list[index].origin_asset.name;
              this.default_amount = data.origin_asset_list[index].amount;
            }
            this.category_list  = data.origin_asset_list;

            this.origin_to_consume_fee_rate = data.origin_to_consume_fee_rate;
            this.origin_to_yuan_withdraw_fee_rate = data.origin_to_yuan_withdraw_fee_rate;
            this.origin_asset_name = data.custom_name.origin_asset_name;
          }else{
            this.reopen = data.reopen;
            this.dividend_min = data.reopen_to_add_weight_dividend_min;
            this.reopen_to_add_weight_dividend_rate = data.reopen_to_add_weight_dividend_rate;
            this.reopen_to_yuan_withdraw_fee_rate = data.reopen_to_yuan_withdraw_fee_rate;
            this.reopen_to_consume_fee_rate = data.reopen_to_consume_fee_rate;
          }
          this.text = text;
          this.fun.setWXTitle(text);
        } else {
          this.$toast(res.msg);
        }
      })
    },
    confirmCategory() {
      this.CategoryShow = false;
      let index = this.category_list.findIndex(item=>item.asset_id==this.radio);
      this.default_name = this.category_list[index].origin_asset.name;
      this.default_amount = this.category_list[index].amount;
    },
    all_handle() {
      if(this.name=='reopen'){
        this.count = this.reopen;
      }else{
        this.count = Number(this.default_amount);
      }
    }
  }
};
</script>

<style scoped lang="scss">
::v-deep .van-cell__title {
  text-align: left;
}

.consensus-activity-withdraw {
  padding: 0.625rem 0.75rem;

  .pointer {
    cursor: pointer;
  }

  .c-FF2F2F {
    color: #ff2f2f;
  }

  .popup-top {
    padding: 1.125rem 0.875rem;
  }

  .flex {
    display: flex;
  }

  .between {
    justify-content: space-between;
  }

  .align-center {
    align-items: center;
  }

  .member {
    padding-bottom: 1rem;
    border-bottom: 1px solid #ccc;
    display: flex;
    align-items: center;
    margin-bottom: 1.25rem;

    input {
      border: none;
      margin-left: 0.7813rem;
    }
  }

  .h50 {
    height: 1.5625rem;
  }

  .tips {
    color: #6e6e79;
    font-size: 0.8125rem;
    margin: 0.625rem 0 1.5625rem;
    text-align: left;
  }

  .all {
    color: #f15353;
    font-size: 0.8125rem;
    flex-shrink: 0;
    margin-left: 0.625rem;
  }

  .content {
    display: flex;
    justify-content: space-between;
    padding: 1.3125rem 0 0.9375rem;
    align-items: flex-end;
    border-bottom: 1px solid #ccc;

    input {
      border: none;
      font-size: 1.5rem;
      font-weight: bold;
      width: 100%;
    }
  }

  .fz26 {
    font-size: 0.8125rem;
  }

  .left {
    text-align: left;
  }

  .main {
    margin-top: 0.625rem;
    padding: 0.9375rem 0.7813rem;
    background: #fff;
    border-radius: 0.625rem;
  }

  .head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border-radius: 0.625rem;
    padding: 1.0938rem 0.75rem;
  }
}
</style>
